@CHARSET "utf-8";

body {
	font-family: sans-serif, Arial, Verdana, "Trebuchet MS";
	font-size: 12px;
	color: #333;
	background-color: #ebebeb;
	margin: 20px;
}

.header {
	width: 100%;
	height: 160px;
}

div {
	display: block;
}
h1 {
	color: #ff9900;
	font-family: Arial;
	text-align: center;
}

#toolBar {
	height: 80px;
	width: 1200px;
	margin: 0 auto;
	padding: 10px;
	background: #ebebeb;
}

#editorContainer {
	background: #fff;
	padding: 0;
	width: 816px;
	height: 1056px;
	margin: 0 auto;
	box-shadow: 0 0 0 1px #d1d1d1, 0 0 4px 1px #ccc;
}

.content {
	cursor: text;
	height: 960px;
	padding: 50px 30px;
	overflow: hidden;
}

.highlight {
	background-color: black;
	opacity: 0.2;
}

input[type="button"]:disabled {
	opacity: 0.5;
}

input.bold {
	background: url(./image/font_bold_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.italic {
	background: url(./image/font_italic_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.underline {
	background: url(./image/font_underline_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.strikethrough {
	background: url(./image/font_strokethrough_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.link {
	background: url(./image/link_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.font {
	background: url(./image/text_letter_t_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.fontsize {
	background: url(./image/font_size_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.left {
	background: url(./image/align_left_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.right {
	background: url(./image/align_right_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.center {
	background: url(./image/align_center_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.indent {
	background: url(./image/indent_increase_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.outdent {
	background: url(./image/indent_decrease_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.numberlist {
	background: url(./image/list_num_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.circlelist {
	background: url(./image/list_bullets_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.image {
	background: url(./image/picture_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.undo {
	background: url(./image/undo_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.redo {
	background: url(./image/redo_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.copy {
	background: url(./image/clipboard_copy_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.paste {
	background: url(./image/clipboard_past_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.cut {
	background: url(./image/clipboard_cut_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.delete {
	background: url(./image/delete_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.hilight {
	background: url(./image/fill_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.textcolor {
	background: url(./image/brush_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.horizontal {
	background: url(./image/Flaticon_32755.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.superscript {
	background: url(./image/Flaticon_38481.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.subscript {
	background: url(./image/Flaticon_38558.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.textheight {
	background: url(./image/Flaticon_39440.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.textwidth {
	background: url(./image/Flaticon_37212.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.createTable {
	background: url(./image/Flaticon_8722.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.removeTable {
	background: url(./image/delete_icon&24.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 24px;
	height: 24px;
}
input.addrow {
	background: url(./image/1395049797_Add_Row.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}
input.deleterow {
	background: url(./image/1395050099_Delete_Row.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}
input.addcolumn {
	background: url(./image/1395049819_Add_Column.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}
input.deletecolumn {
	background: url(./image/1395049845_Delete_Column.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}
input.bordercolor {
	background: url(./image/1395050501_border_color.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}
input.backcolor {
	background: url(./image/1395050917_color-picker.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}
input.comment {
	background: url(./image/1395052084_comment_add.png) no-repeat;
	cursor: pointer;
	border: none;
	width: 32px;
	height: 32px;
}

.commentbox {

	width: 240px;
	border: 2px #888888 solid;
	background-color: #ccff66;
	border-radius: 25px;
	padding: 10px;
	text-align: center;
	margin: 10px;
	overflow: hidden;
}
.commentDiv {

	position: absolute;
	float: left;
	margin-left: 850px;
	height: 1056px;
	top: 190px;
	text-align: left;
}
#contextMenu {
	background-color: #ffffff;
}
